<template>
  <div class="container">
    <view>
      <scale-image
        :src="cover"
        :ratio="15/7"
      />
    </view>
    <view class="rank-body">
      - 暂无榜单 -
    </view>
  </div>
</template>

<script>
// import { getWorkRank } from '@/api'
import ScaleImage from '@/components/scaleImage'
export default {
  components: {
    ScaleImage
  },
  data () {
    return {
      id: 3,
      cover: '/static/images/rank.jpg',
      list: [],
      rank: null,
      mine: null,
      title: ''
    }
  },
  onLoad (option) {
    console.log(option)
    if (option.id) {
      this.id = option.id
    }
  },
  onShow () {
    console.group('rankonShow')
    this.onLoadRank()
    console.groupEnd('rankonShow')
  },
  computed: {

  },
  watch: {
  },
  methods: {
    onLoadRank () {
      console.group('onLoadRank')
      console.log('default id:', this.id)
      // getWorkRank(this.id).then(res => {
      //   this.loaded = true
      // })
      console.groupEnd('onLoadRank')
    }
  }
}
</script>

<style lang="less">
.rank-body {
  position: fixed;
  top: 26%;
  left: 0;
  width: 100%;
  height: 74%;
  border-radius: 20px 20px 0 0;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ccc;
  padding-bottom: 30%;
}
</style>
